<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>内容页面(′д｀ )…彡…彡♥</title>
    <link rel="icon" href="${pageContext.request.contextPath}/static/title.ico" type="image/x-icon"/>

    <link href="css/cl-css.css" rel="stylesheet">
    <!-- CSS only -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/css/bootstrap.min.css"
          integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    <!-- JS, Popper.js, and jQuery -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
            integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
            crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
            integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
            crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/js/bootstrap.min.js"
            integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
            crossorigin="anonymous"></script>

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.js"></script>
    <script src="js/details.js"></script>
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <script src="js/common.js"></script>
    <link rel="stylesheet" href="highlight/styles/railscasts.css">
</head>
<body style="background-color: #FEE140;
background-image: linear-gradient(180deg, #FEE140 0%, #FA709A 100%);">
<%@include file="/JSP/common/header.jsp" %>
<div style="height: 50px"></div>
<div class="cl-cantainer container">
    <div class="row">
        <div class="col-md-9 cl-left">
            <div class="cl-artical-content">

            </div>

        </div>

        <div class="col-md-3 cl-right">
            <div class="right-card">

                <div class="right-card-main">
                    <div class="right-card-title">博主</div>
                    <div class="cl-code">
                        <img src="temporary-img/code.jpg" style="border-radius: 120px" class="img-fluid" alt="">
                        <div id="div1" style="height: 50px;font-size: 15px;font-weight: bolder;margin-top: 20px"></div>
                    </div>

                </div>
            </div>

            <div class="right-card">

                <div class="right-card-main">
                    <div class="right-card-title">最新文章</div>
                    <div class="right-recommended"><a href="#"><img src="temporary-img/bg.jpg" class="img-fluid"
                                                                    alt=""></a></div>
                    <ul class="right-recommended-list">


                    </ul>
                </div>
            </div>

            <div class="right-card">

                <div class="right-card-main">
                    <div class="right-card-title">热门标签</div>
                    <ul class="label">

                    </ul>
                </div>
            </div>

        </div>
    </div>
</div>


<div class="container-fluid cl-footer">
    <div class="container">
        <p class="cl-copyright">老麦，一个沉重的灵魂</p>
        <p class="cl-copyright">copyright @ 2020 老麦@Saxon</p>
    </div>
</div>
<script>

    !function () {

        function n(n, e, t) {

            return n.getAttribute(e) || t

        }

        function e(n) {

            return document.getElementsByTagName(n)

        }

        function t() {

            var t = e("script"), o = t.length, i = t[o - 1];

            return {

                l: o, z: n(i, "zIndex", -1), o: n(i, "opacity", .5), c: n(i, "color", "0,0,0"), n: n(i, "count", 99)

            }

        }

        function o() {

            a = m.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth,

                c = m.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight

        }

        function i() {

            r.clearRect(0, 0, a, c);

            var n, e, t, o, m, l;

            s.forEach(function (i, x) {

                for (i.x += i.xa, i.y += i.ya, i.xa *= i.x > a || i.x < 0 ? -1 : 1, i.ya *= i.y > c || i.y < 0 ? -1 : 1, r.fillRect(i.x - .5, i.y - .5, 1, 1), e = x + 1; e < u.length; e++) n = u[e],

                null !== n.x && null !== n.y && (o = i.x - n.x, m = i.y - n.y,

                    l = o * o + m * m, l < n.max && (n === y && l >= n.max / 2 && (i.x -= .03 * o, i.y -= .03 * m),

                    t = (n.max - l) / n.max, r.beginPath(), r.lineWidth = t / 2, r.strokeStyle = "rgba(" + d.c + "," + (t + .2) + ")", r.moveTo(i.x, i.y), r.lineTo(n.x, n.y), r.stroke()))

            }),

                x(i)

        }

        var a, c, u, m = document.createElement("canvas"),

            d = t(), l = "c_n" + d.l, r = m.getContext("2d"),
            x = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||

                function (n) {

                    window.setTimeout(n, 1e3 / 45)

                },

            w = Math.random, y = {x: null, y: null, max: 2e4};
        m.id = l, m.style.cssText = "position:fixed;top:0;left:0;z-index:" + d.z + ";opacity:" + d.o, e("body")[0].appendChild(m), o(), window.onresize = o,

            window.onmousemove = function (n) {

                n = n || window.event, y.x = n.clientX, y.y = n.clientY

            },

            window.onmouseout = function () {

                y.x = null, y.y = null

            };

        for (var s = [], f = 0; d.n > f; f++) {

            var h = w() * a, g = w() * c, v = 2 * w() - 1, p = 2 * w() - 1;
            s.push({x: h, y: g, xa: v, ya: p, max: 6e3})

        }

        u = s.concat([y]),

            setTimeout(function () {
                i()
            }, 100)

    }();

</script>
<%--打字机--%>
<script type="text/javascript">
    var count=0;
    var typingtext="大声说出：博主最帅"
    var myBlock=document.getElementById('div1');
    function type(){
        if(count<=typingtext.length){
            myBlock.innerHTML=typingtext.substring(0,count);
            count++;
        }else{
            myBlock.innerHTML="";
            count=0;
        }
    }
    var intervalID=window.setInterval(type,300);
</script>
<script src="highlight/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
</body>
</html>